<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="UTF-8" import="java.util.*" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>商品详情页</title>
    <style>
        *{
            padding: 0px;
            margin: 0px;
        }
        #top{
            margin: auto;
            background-image: url("../images/sofa.png");
            width: 100%;
            background-repeat: no-repeat;
            height: 400px;
            position: relative;
        }
        #t_top{
            width: 100%;
            height: 60px;
            color: grey;
            font-size: 12px;
            position: absolute;
            top: 0px;
            border-bottom: 2px solid white;
        }
        #t_left{
            float: left;
            margin: 20px 80px;
        }
        .t_right{
            float: right;
            line-height: 60px;
            padding: 0px 33px;
        }

        #exzoom {
            width: 500px;
            /*height: 500px;*/
            margin: 20px auto;
        }
        .kuanshi li{
            display: inline-block;
            margin: 0px 10px;
        }
        .kuanshi li img{
            height: 80px;
            width: 80px;
            float: left;
        }
        #bottom{
            width: 100%;
            float: left;
            height: 280px;
            text-align: center;
        }


    </style>
    <link rel="stylesheet" href="../css/bootstrap.min.css">
    <script src="../js/jquery-3.4.1.min.js"></script>
    <script src="../js/bootstrap.min.js"></script>
    <link rel="stylesheet" type="text/css" href="../css/normalize.css" /><!--CSS RESET-->
    <link href="../src/jquery.exzoom.css" rel="stylesheet" type="text/css"/>
    <script>
        window.onload=function (ev) {
            $("#dropdownMenu1").hover(
                function () {
                    $("#dropDownCur").show();
                });//为了鼠标可以进入下拉框
            $("#dropDownCur").hover(function () {
                $(this).show();//鼠标进入下拉框
            }, function () {
                $(this).hide();//鼠标离开下拉框后，就会消失
            });
        }
    </script>
</head>
<body style="background-color: #e5e5e5">
<div id="top">
    <div id="t_top">
        <div id="t_left"><a href="main.jsp"><img src="../images/youjiaw.png" height="50" width="90"/></a></div>
        <div id="t_right3" class="t_right">联系我们：<b style="color: red">13815559400</b></div>
        <div id="t_right5" class="t_right"><a href="regist.jsp" style="text-decoration: none;color: grey">注册</a></div>
        <div id="t_right4" class="t_right"><a href="login.jsp" style="text-decoration: none;color: grey">登录</a></div>
        <div id="t_right2" class="t_right">
            <li class="dropdown" style="list-style: none">
                <a href="javascript:void(0);" class="dropdown-toggle" data-toggle="dropdown" id="dropdownMenu1" style="text-decoration: none;color: grey">家居产品</a>
                <ul class="dropdown-menu" style="background-color: white;" id="dropDownCur">
                    <li><a href="goodPage.jsp">卧室家具</a></li>
                    <li><a href="goodPage.jsp">厨房家具</a></li>
                    <li><a href="goodPage.jsp">客厅家具</a></li>
                    <li><a href="goodPage.jsp">卫生间家具</a></li>
                </ul>
            </li>
        </div>
        <div id="t_right1" class="t_right"><a href="main.jsp" style="text-decoration: none;color: grey">首页</a></div>
    </div>
</div>

<div class="htmleaf-container" style="width: 1400px;height:700px;background-image: url(../images/download.jpg);margin: 80px auto;">
    <div style="height: 50px"></div>
    <div style="height: 600px;width: 1150px;margin: 0px auto;background-color: #ffffff;">
        <div style="height: 8px;"></div>
        <div class="exzoom" id="exzoom" style="margin: 0px 30px 0px 100px;float: left">
            <!--大图区域-->
            <div class="exzoom_img_box">
                <ul class='exzoom_img_ul'>
                    <li><img src="../images/good1/O1CN01ounDqb1SjejD7owHj_!!1966652283.jpg"></li>
                    <li><img src="../images/good1/O1CN01BeNlAN1SjejDyX7NF_!!1966652283.jpg"></li>
                    <li><img src="../images/good1/O1CN01iCsC901SjemBF2Clu_!!0-item_pic.jpg"></li>
                    <li><img src="../images/good1/O1CN01ow0oM81SjekWGQOQJ_!!1966652283.gif"></li>
                    <li><img src="../images/good1/O1CN012nMZgx1SjejDzw00Z_!!1966652283.jpg"></li>
                    <li><img ></li>
                    <li><img ></li>
                </ul>
            </div>
            <!--缩略图导航-->
            <div class="exzoom_nav"></div>
            <!--控制按钮-->
            <p class="exzoom_btn">
                <a href="javascript:void(0);" class="exzoom_prev_btn"> &lt; </a>
                <a href="javascript:void(0);" class="exzoom_next_btn"> &gt; </a>
            </p>
        </div>
        <div id="g_right" style="width: 520px;float: right;">
            <b style="font-size: 30px;letter-spacing: 2px;display:block">摘星辰狂拽酷炫吊炸天吊灯</b>
            <div style="margin-top: 20px">价格：<b style="font-size: 28px;color: red;display: inline" >￥2000</b></div>
            <div style="margin-top: 25px">
               <p style="float: left">款式:</p>
                <ul class='kuanshi' style="list-style: none">
                    <a href="javascript:void(0)"><li><img src="../images/good1/O1CN01ounDqb1SjejD7owHj_!!1966652283.jpg"></li></a>
                    <a href="javascript:void(0)"><li><img src="../images/good1/O1CN01BeNlAN1SjejDyX7NF_!!1966652283.jpg"></li></a>
                    <a href="javascript:void(0)"> <li><img src="../images/good1/O1CN01iCsC901SjemBF2Clu_!!0-item_pic.jpg"></li></a>
                    <a href="javascript:void(0)"><li><img src="../images/good1/O1CN012nMZgx1SjejDzw00Z_!!1966652283.jpg"></li></a>
                </ul>
            </div>
            <div style="margin-top: 25px">
                <p>尺码：<img src="../images/tell04.png" height="36" width="54"></p>
            </div>
            <div style="text-align: center;margin: 25px 0px">
                <button type="button" class="btn-lg btn-danger"><img src="../images/ht.png">立即购买</button>&nbsp;&nbsp;
                <button type="button" class="btn-lg btn-danger"><img src="../images/shop.png"></img>加入购物车</button>
            </div>
            <div style="margin-top: 30px">
                <p>服务承诺：<img src="../images/tell08.png" height="31" width="420"></p>
                <p>支付方式：<img src="../images/tell09.png"></p>
            </div>
        </div>
    </div>

</div>
<div style="width: 1150px;background-color: white;margin:0px auto;margin-top: -50px">
    <div style="margin:0px auto;width: 800px">
        <img src="../images/O1CN01Phpwya1TzyUN1elma_!!717112454.jpg" height="782" width="790"/>
        <img src="../images/O1CN0184tVqe1TzyUP7ZeBS_!!717112454.jpg" height="956" width="790"/>
        <img src="../images/O1CN011fZfrx1TzyRfwpogM_!!717112454.jpg" height="718" width="750"/>
        <img src="../images/O1CN01Z4zTuT1TzyUMALsVZ_!!717112454.jpg" height="800" width="800"/>
        <img src="../images/O1CN01VMrsp31TzyRf8nuo6_!!717112454.jpg" height="872" width="750"/>
    </div>
</div>
<div id="bottom" style="background-color: #d9d9d9;margin-top: 100px;">
    <div class="jia_foot_info" style="margin-top: 50px">
        <div class="jia_foot_con">
            <p class="jia_foot_link">
                <a href="//www.jia.com/help/0001.html" rel="nofollow" target="_blank">关于我们</a><span class="jia_split">|</span>
                <a href="//www.jia.com/help/0029.html" target="_blank" rel="nofollow">联系我们</a><span class="jia_split">|</span>
                <a href="//news.jia.com/" target="_blank" rel="nofollow">媒体报道</a><span class="jia_split">|</span>
                <a href="//www.jia.com/help/0032.html" target="_blank" rel="nofollow">法律声明</a><span class="jia_split">|</span>
                <a href="//www.jia.com/help/0002.html" target="_blank" rel="nofollow">企业文化</a><span class="jia_split">|</span>
                <a href="http://www.qeeka.com" target="_blank" rel="nofollow">投资者关系</a><span class="jia_split">|</span>
                <a href="//www.jia.com/page/zhaoshang/zhuangxiu.html" target="_blank" rel="nofollow">入驻装修平台</a><span class="jia_split">|</span>
                <a href="//www.jia.com/zhaoshang/" tjjj="sjrz.2" target="_blank" rel="nofollow">零售合作</a><span class="jia_split">|</span>
                <a href="//www.jia.com/page/hhrzs/index.html" tjjj="jmqjds" target="_blank" rel="nofollow">加盟齐家典尚</a><span class="jia_split">|</span>
                <a href="//www.jia.com/help/0055.html" target="_blank" rel="nofollow">诚聘英才</a><span class="jia_split">|</span>
                <a href="//www.jia.com/help/0033.html" target="_blank">网站地图</a><span class="jia_split">|</span>
                <a href="//www.jia.com/help/" tjjj="bottom.link.help">帮助中心</a><span class="jia_split">|</span>
                <a href="//www.jia.com/help/yyzz.html" tjjj="bottom.link.help">营业执照</a><span class="jia_split">|</span>
                <a href="javascript:;" class="jia_foot_open">更多<i></i></a>
            </p>
            <p class="jia_foot_link footnone">
                <a href="//www.jia.com/zx/" target="_blank" tjjj="footer.bottom.1">找装修公司</a><span class="jia_split">|</span>
                <a href="//www.jia.com/wangpu/c/citylist/" target="_blank" tjjj="footer.bottom.2">买建材家居</a><span class="jia_split">|</span>
                <a href="//tg.jia.com/" target="_blank" tjjj="footer.bottom.3">齐家团购</a><span class="jia_split">|</span>
                <a href="//www.jia.com/baike/" target="_blank" tjjj="footer.bottom.4">家居百科</a><span class="jia_split">|</span>
                <a href="//www.jia.com/company/" target="_blank" tjjj="footer.bottom.5">装修公司库</a><span class="jia_split">|</span>
                <a href="//www.jia.com/product/" target="_blank" tjjj="footer.bottom.7">产品信息库</a><span class="jia_split">|</span>
                <a href="//www.jia.com/wenda/" target="_blank" tjjj="footer.bottom.9">装修知识</a><span class="jia_split">|</span>
                <a href="//tuku.jia.com/jiaju/" tjjj="2014.foot.jiajupic">家居效果图</a><span class="jia_split">|</span>
                <a href="http://m.jia.com/" tjjj="2014.foot.wap">齐家手机站</a><span class="jia_split">|</span>
                <a href="//www.jia.com/wangpu/" tjjj="2014.foot.wangpu">店铺大全</a><span class="jia_split">|</span>
                <a href="//www.jia.com/pinpai/" target="_blank" tjjj="footer.bottom.8">品牌库</a><span class="jia_split">|</span>
                <a href="//www.jia.com/zxq/" target="_blank" tjjj="footer.bottom.12">找小区</a><span class="jia_split">|</span>
                <a href="//www.jia.com/jcjm/" target="_blank" tjjj="footer.bottom.10">建材加盟</a><span class="jia_split">|</span>
                <a href="//zixun.jia.com/xgt/" target="_blank" tjjj="footer.bottom.11">装修效果图</a><span class="jia_split">|</span>
                <a href="//www.jia.com/hunqing/" target="_blank" tjjj="footer.bottom.12">婚庆</a>
            </p>
        </div>
        <p>
            优家网 版权所有Copyright  2005-2019 www.jia.com All rights reserved
        </p>
        <p>
            中国互联网协会信用评价中心网信认证 网信编码:1664391091 举报电话：021-69108618
        </p>
        <p>
            <a href="//oneimg1.jia.com/content/public/resource/image/tg_home/yiye.gif">
                <img src="//oneimg1.jia.com/content/public/resource/image/tg_home/gov-inco.jpg" border="0" width="40" height="44">
            </a>
            <a href="//www.jia.com/315/" target="_blank" style="margin-left:15px;">
                <img src="//fastued3.jia.com/image/common/315.gif" border="0">
            </a>
        </p>
    </div>

</div>

<script src="../js/jquery-3.4.1.min.js" type="text/javascript"></script>
<script src="../src/jquery.exzoom.js"></script>
<script type="text/javascript">
    $("#exzoom").exzoom({
        autoPlay: false,
    });//方法调用，务必在加载完后执行
</script>
</body>
</html>